import type { ButtonProps, TooltipProps } from "antd";
import MyTooltip from "../MyTooltip";
import ToolButton from "../toolButton";
import { useState } from "react";

interface IProps {
    tooltipProps?: TooltipProps;
    buttonProps?: ButtonProps;
    children: React.ReactNode;
};

export default function MyTooltipButton(props: IProps) {
    const [isShowTextTip, setIsShowTextTip] = useState(false);

    const children = props?.children;
    if(!children) return null;
    
    return (
        <div>
            <MyTooltip 
                open={ isShowTextTip }
                {...props?.tooltipProps}
            >
                <ToolButton
                    onMouseEnter={() => setIsShowTextTip(true)}
                    onMouseLeave={() => setIsShowTextTip(false)}
                    {...props.buttonProps}
                >
                    { children }
                </ToolButton>
            </MyTooltip>
        </div>
    );
}
